
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<!DOCTYPE html>
<html>
<head>

    <title>用户管理</title>
    <%@include file="../sys_common_head.jsp"%>
</head>
<body class="pear-container">
<div class="layui-card">
    <!-- 查询条件 -->
    <div class="layui-card-body">
        <form class="layui-form" action="">
            <div class="layui-form-item">
                <div class="layui-form-item layui-inline">
                    <label class="layui-form-label">用户名</label>
                    <div class="layui-input-inline">
                        <input type="text" name="realName" placeholder="" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item layui-inline">
                    <label class="layui-form-label">性别</label>
                    <div class="layui-input-inline">
                        <input type="text" name="realName" placeholder="" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item layui-inline">
                    <label class="layui-form-label">邮箱</label>
                    <div class="layui-input-inline">
                        <input type="text" name="realName" placeholder="" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item layui-inline">
                    <button class="pear-btn pear-btn-md pear-btn-primary" lay-submit lay-filter="data-query">
                        <i class="layui-icon layui-icon-search"></i>
                        查询
                    </button>
                    <button type="reset" class="pear-btn pear-btn-md">
                        <i class="layui-icon layui-icon-refresh"></i>
                        重置
                    </button>
                </div>
            </div>
        </form>
    </div>
</div>

<div class="layui-card">
    <div class="layui-card-body">
        <!-- 表格数据 -->
        <table id="data-table" lay-filter="data-table"></table>
    </div>
</div>

<!-- 工具栏 -->
<script type="text/html" id="data-toolbar">
    <shiro:hasPermission name="system:user:edit">
        <button class="pear-btn pear-btn-primary pear-btn-md" lay-event="add">
            <i class="layui-icon layui-icon-add-1"></i>
            新增
        </button>
    </shiro:hasPermission>

    <shiro:hasPermission name="system:user:remove">
        <button class="pear-btn pear-btn-danger pear-btn-md" lay-event="batchRemove">
            <i class="layui-icon layui-icon-delete"></i>
            删除
        </button>
    </shiro:hasPermission>

</script>

<!-- 每行操作栏 -->
<script type="text/html" id="data-bar">
<shiro:hasPermission name="system:user:edit">
    <button class="pear-btn pear-btn-primary pear-btn-sm" lay-event="edit" title="修改"><i class="layui-icon layui-icon-edit"></i></button>
</shiro:hasPermission>
<shiro:hasPermission name="system:user:changePWD">
    <button class="pear-btn pear-btn-warming pear-btn-sm" lay-event="editPWD" title="修改密码"><i class="layui-icon layui-icon-vercode"></i></button>
</shiro:hasPermission>
<shiro:hasPermission name="system:user:remove">
    <button class="pear-btn pear-btn-danger pear-btn-sm" lay-event="remove" title="删除"><i class="layui-icon layui-icon-delete"></i></button>
</shiro:hasPermission>
</script>

<script>
    layui.use(['table', 'form', 'jquery','common'], function() {
        let table = layui.table;
        let form = layui.form;
        let $ = layui.jquery;
        let common = layui.common;

        let MODULE_PATH = "<%=request.getContextPath()%>/system/user/";


        table.render({
            elem: '#data-table',
            url: MODULE_PATH + 'list',
            method:'post',
            toolbar: '#data-toolbar',
            cols: [[ //表头
                {type: 'checkbox'},
                {field: 'userId', title: '用户id'}
                ,{field: 'username', title: '用户名'}
                ,{field: 'mobile', title: '移动电话'}
                ,{field: 'email', title: '邮箱'}
                ,{field: 'status', title: '状态',templet:function(d){
                        if(d.status == 0){
                            return "已禁用";
                        }else{
                            return "正常";
                        }
                    }}
                ,{field: 'addtime', title: '添加时间',templet:function(d){
                        return timestampToTime(d.createTime);
                    }}
                ,{fixed: 'right', width: 165, align:'center', toolbar: '#data-bar'}
            ]],
            limits: [10, 15, 20, 25, 50, 100],
            limit: 15,
            page: true
        });

        table.on('tool(data-table)', function(obj) {
            if (obj.event === 'remove') {
                window.remove(obj);
            } else if (obj.event === 'edit') {
                window.edit(obj);
            } else if (obj.event === 'editPWD') {
                window.editPWD(obj);
            }
        });

        table.on('toolbar(data-table)', function(obj) {
            if (obj.event === 'add') {
                window.add();
            } else if (obj.event === 'refresh') {
                window.refresh();
            } else if (obj.event === 'batchRemove') {
                window.batchRemove(obj);
            }
        });

        form.on('submit(data-query)', function(data) {
            table.reload('data-table', {
                where: data.field
            })
            return false;
        });

        form.on('switch(data-enable)', function(obj) {
            layer.tips(this.value + ' ' + this.name + '：' + obj.elem.checked, obj.othis);
        });

        window.add = function() {
            layer.open({
                type: 2,
                title: '新增',
                shade: 0.1,
                area: [common.isModile()?'100%':'500px', common.isModile()?'100%':'400px'],
                content: MODULE_PATH + 'add'
            });
        }

        window.edit = function(obj) {
            layer.open({
                type: 2,
                title: '修改',
                shade: 0.1,
                area: ['500px', '400px'],
                content: MODULE_PATH + 'edit?id=' + obj.data['userId']
            });
        }

        window.edit = function(obj) {
            layer.open({
                type: 2,
                title: '修改',
                shade: 0.1,
                area: ['500px', '400px'],
                content: MODULE_PATH + 'edit?id=' + obj.data['userId']
            });
        }

        window.editPWD = function(obj) {
            layer.prompt({
                formType: 1,
                title: '请输入密码'
            }, function(value, index, elem){

                if(value.length < 6){
                    layer.alert('密码必须是大于6位', {icon: 2});
                    layer.close(index);
                    return;
                }

                $.ajax({
                    url: '<%=request.getContextPath()%>/system/user/adminChangePWD',
                    dataType: 'json',
                    data:{
                        userId:obj.data['userId'],
                        pwd:value
                    },
                    type: 'PUT',
                    success: function(result) {
                        if (result.code == 0) {
                            layer.msg(result.msg, {
                                icon: 1,
                                time: 1000
                            }, function() {
                            });
                        } else {
                            layer.msg(result.msg, {
                                icon: 2,
                                time: 1000
                            });
                        }
                    }
                })

                layer.close(index);
            });
        }

        window.remove = function (obj) {
            layer.confirm('确定要删除该用户', {icon: 3, title: '提示'}, function (index) {
                layer.close(index);
                let loading = layer.load();
                $.ajax({
                    url: MODULE_PATH + "remove/" + obj.data['userId'],
                    dataType: 'json',
                    type: 'delete',
                    success: function (result) {
                        layer.close(loading);
                        if (result.code == 0) {
                            layer.msg(result.msg, {icon: 1, time: 1000}, function () {
                                obj.del();
                            });
                        } else {
                            layer.msg(result.msg, {icon: 2, time: 1000});
                        }
                    }
                })
            });
        }

        window.batchRemove = function(obj) {

            let data = table.checkStatus(obj.config.id).data;
            if (data.length === 0) {
                layer.msg("未选中数据", {icon: 3, time: 1000});
                return false;
            }
            let ids = "";
            for (let i = 0; i < data.length; i++) {
                ids += data[i].userId + ",";
            }

            layer.confirm('确定要删除这些用户', {
                icon: 3,
                title: '提示'
            }, function(index) {
                layer.close(index);
                let loading = layer.load();
                $.ajax({
                    url: MODULE_PATH + "removeBatch/" + ids,
                    dataType: 'json',
                    type: 'delete',
                    success: function(result) {
                        layer.close(loading);
                        if (result.success) {
                            layer.msg(result.msg, {
                                icon: 1,
                                time: 1000
                            }, function() {
                                table.reload('user-table');
                            });
                        } else {
                            layer.msg(result.msg, {
                                icon: 2,
                                time: 1000
                            });
                        }
                    }
                })
            });
        }

        window.refresh = function(param) {
            table.reload('user-table');
        }


    })


</script>

</body>
</html>
